<script setup lang="ts">
import { computed, ref } from "vue";
import FlowDefForm from "./config/common/FlowDefForm.vue";
import type { Process } from "@/views/design/process/ProcessNodes";

const defFlow = defineModel<Process>("defFlow");

const flowDefFormRef = ref();

async function validate() {
  return new Promise((resolve, reject) => {
    flowDefFormRef.value
      .validate()
      .then(() => {
        resolve([]);
      })
      .catch(errs => {
        reject(errs);
      });
  });
}

defineExpose({ validate });
</script>

<template>
  <el-main class="w-designer-base">
    <FlowDefForm ref="flowDefFormRef" v-model:defFlow="defFlow" />
  </el-main>
</template>

<style lang="scss" scoped>
.w-designer-base {
  width: 650px;
  min-height: calc(100vh - 100px);
  margin: 0 auto;
  background-color: white;
  border-radius: 5px;
}
</style>
